<template>
	<view class="white-bg radius-10 mg-top-30 pd-30">
		<view class="flex flex-center info">
			<image class="icon" src="@/static/icon/gray-location.png" mode="heightFix"></image>
			<text class="info-k flex1">适用城市</text>
			<text class="info-v" v-if="cityType">{{cityType}}类</text>
		</view>
		<view class="flex flex-center info">
			<image class="icon" src="@/static/icon/gray-lock.png" mode="heightFix"></image>
			<text class="info-k flex1">卡密信息</text>
			<text class="info-v" v-if="card">{{card}}</text>
		</view>
		<view class="flex flex-center info">
			<image class="icon" src="@/static/icon/gray-mobile.png" mode="heightFix"></image>
			<text class="info-k flex1">订单手机号</text>
			<text class="info-v">{{mobile}}</text>
		</view>
	</view>
</template>

<script>
	export default {
		name: "cardInfo",
		props: {
			cityType: {
				type: String,
				default: ''
			},
			mobile: {
				type: String, 
				default: ''
			},
			card: {
				type: String,
				default: ''
			}
		},
		data() {
			return {
				
			};
		}
	}
</script>

<style lang="scss">

.info{
	line-height: 70rpx;
	.icon{
		height: 32rpx;
		margin-right: 20rpx;
	}
	.info-k{
		font-size: 28rpx;
		color: $uni-color-gray;
		font-weight: bold;
	}
	.info-v{
		font-size: 30rpx;
		color: $uni-color-orange;
	}
}
</style>
